<template>
    <el-drawer
        size="50%"
        v-model="isShow"
        :with-header="false"
        :destroy-on-close="true"
        @close="closeHandle"
        :close-on-press-escape="false"
        :close-on-click-modal="false"
        :show-close="false"
    >
    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
        <el-tab-pane label="详情" name="detail">
            <Info :data="selectedData" />
        </el-tab-pane>
        <el-tab-pane label="人员进入" name="comeIn" >
            <comeIn ref="ComeInRef" :data="selectedData" :AreaType="AreaTypeData" @updataList="updataListas"  />
        </el-tab-pane>
        
        <el-tab-pane label="法律文书" name="file">
            <File ref="FileRef" :data="selectedData" />
        </el-tab-pane>
        
        <el-tab-pane label="安检" name="SecurityCheck">
            <SecurityCheck :data="selectedData" />
        </el-tab-pane>

        <el-tab-pane label="就医体检" name="Physicalexamination">
            <Physicalexamination :data="selectedData" />
        </el-tab-pane>

        <el-tab-pane label="物品寄存" name="GoodsMain">
            <GoodsMain ref="GoodsMainRef" :data="selectedData" />
        </el-tab-pane>

        <el-tab-pane label="特情登记" name="DutyRecord">
            <DutyRecord :data="selectedData" />
        </el-tab-pane>

        <el-tab-pane label="违规违纪登记" name="BreakRoles">
            <BreakRoles :data="selectedData" />
        </el-tab-pane>

        <el-tab-pane label="更换办案房间" name="ComeInDetail">
            <ComeInDetail ref="ComeInDetailRef" :data="selectedData" :AreaType="AreaTypeData" @updataList="updataListas" />
        </el-tab-pane>

        <el-tab-pane label="人员离开" name="getOut">
            <GetOut :data="selectedData" />
        </el-tab-pane>
        <!-- <el-tab-pane label="开启摄像头-测试" name="Ceshi">
            <Ceshi :data="selectedData" />
        </el-tab-pane> -->
    </el-tabs>
        <template #footer>
            <el-button @click="isShow = false">关闭</el-button>
        </template>
    </el-drawer>
</template>

<script setup>
import {getCurrentInstance} from "vue";

import Info from "@/components/BAManageDetail/BAManageDetailActive/info.vue";
import comeIn from "@/components/BAManageDetail/BAManageDetailActive/comeIn.vue";
import File from "@/components/BAManageDetail/BAManageDetailActive/file.vue";
import SecurityCheck from "@/components/BAManageDetail/BAManageDetailActive/SecurityCheck.vue";

import Physicalexamination from "@/components/BAManageDetail/BAManageDetailActive/Physicalexamination.vue";
import GoodsMain from "@/components/BAManageDetail/BAManageDetailActive/GoodsMain.vue";
import DutyRecord from "@/components/BAManageDetail/BAManageDetailActive/DutyRecord.vue";
import BreakRoles from "@/components/BAManageDetail/BAManageDetailActive/BreakRoles.vue";
import ComeInDetail from "@/components/BAManageDetail/BAManageDetailActive/ComeInDetail.vue";
import GetOut from "@/components/BAManageDetail/BAManageDetailActive/GetOut.vue";

import Ceshi from "@/components/BAManageDetail/BAManageDetailActive/ceshi.vue";

const {proxy} = getCurrentInstance()
const {nj_sex,nj_sheanren_type,nj_sheanren_status} = proxy.useDict( 'nj_sex','nj_sheanren_type','nj_sheanren_status')
// 是否显示抽屉
const isShow = ref(false)

const loading = ref(false)
const selectedData = ref({})

const ComeInDetailRef = ref()
const ComeInRef = ref()
const FileRef = ref()

const activeName = ref('detail')
// 通知事件
const emit = defineEmits(['getBAManageList'])

const AreaTypeData = ref()
const changeShowStatus = () => {
    isShow.value = !isShow.value
}
onMounted(() => {
    
})
const handleClick = (tab, event) => {
    console.log(tab.props.name,"tab.props.name")
    if (tab.props.name === 'comeIn' && tab.props.name === 'file') {
        // 切换到comeIn标签页
    } else {
        // 切换到其他标签页时触发关闭
        if (ComeInRef.value) {
            ComeInRef.value.closewebSocketService();
        }
        if (FileRef.value) {
            FileRef.value.closewebSocketService();
        }
    }
}
const showDetail = (data,AreaType) => {
    selectedData.value = data
    AreaTypeData.value = AreaType
    console.log(data,AreaType,"从列表上传过来的data还有AreaType")
    changeShowStatus()
}

defineExpose({showDetail})

const updataListas = (mes) => {
    if(mes === 'fromcomeIn'){
        ComeInDetailRef.value.getUserInfo()
        ComeInDetailRef.value.getApplyDetailInfo()
    }
    if(mes === 'fromcomeInDetail'){
        ComeInRef.value.getUserInfo()
        ComeInRef.value.getApplyDetailInfo()
    }
    emit('getBAManageList', "来了老弟")
}
// 关闭后的回调事件
const closeHandle = () => {
    ComeInRef.value.closewebSocketService()
    emit('getBAManageList', "来了老弟")
    console.log(123123)
}
</script>

<style lang="scss" scoped>

</style>